<template>
  <div class="register-container">
    <el-card
      :device="useAppStore().device"
      class="z-1 !border-none w-100 !bg-transparent !rounded-4% <sm:w-83"
    >
      <h3 class="register-container_title">账号注册</h3>
      <register-form />
    </el-card>
  </div>
</template>
<script lang="ts" setup>
import { useAppStore } from "@/stores/modules/app";

import RegisterForm from "@/components/RegisterForm/index.vue";
</script>
<style lang="scss" scoped>
.register-container {
  width: 100vw;
  height: 100vh;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background: url(@/assets/images/login-bg.jpg) no-repeat bottom right;
  background-size: 100%;

  &_title {
    text-align: center;
    margin: 0;
    margin-bottom: 18px;
  }
}

:deep(.el-card__body) {
  padding: 40px 30px;
  background-color: #fff;
}
</style>
